<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

	<head>

		<meta charset="utf-8"/>
		<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

		<title>微光协同办公平台-会议列表</title>
		<link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
		<link th:href="@{/css/font-awesome.css}" rel="stylesheet"/>
		<link th:href="@{/css/plugins/bootstrap-table/bootstrap-table.min.css}" rel="stylesheet"/>
		<link th:href="@{/css/animate.css}" rel="stylesheet"/>
		<link th:href="@{/css/style.css}" rel="stylesheet"/>


	</head>

	<body onload="init()">
	<div class="col-sm-12" style="height: 30px;" ></div>
		<div class="col-sm-12">
			<!-- Example Events -->
			<div class="example-wrap">
				<div class="example">
					
					<div class="btn-group hidden-xs" id="exampleTableEventsToolbar" role="group">
						<button type="button" class="btn btn-outline btn-default" onclick="add()">
                                        <i class="glyphicon glyphicon-plus" aria-hidden="true"></i>
                                    </button>
						<button type="button" class="btn btn-outline btn-default" onclick="change()">
                                        <i class="glyphicon glyphicon-edit" aria-hidden="true"></i>
                                    </button>
						<button type="button" class="btn btn-outline btn-default" onclick="del()">
                                        <i class="glyphicon glyphicon-trash" aria-hidden="true"></i>
                                    </button>
					</div>
					<table id="exampleTableEvents" data-height="400" data-mobile-responsive="true">
						<thead>
							<tr>
								<th data-field="state" data-checkbox="true"></th>
								<th data-field="mId">ID</th>
								<th data-field="mUser">使用者</th>
								<th data-field="mCondition">使用条件</th>
								<th data-field="mScene" style="">场景</th>
								<th data-field="mDescription" style="">描述</th>
							</tr>
						</thead>
					</table>
				</div>
			</div>
			<!-- End Example Events -->
		</div>

	</body>
	<!-- 全局js -->
	<script th:src="@{/js/jquery.min.js}"></script>
	<script th:src="@{/js/bootstrap.min.js}"></script>

	<!-- 自定义js -->
	<script th:src="@{/js/content.js}"></script>

	<!-- Bootstrap table -->
	<script th:src="@{/js/plugins/bootstrap-table/bootstrap-table.min.js}"></script>
	<script th:src="@{/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js}"></script>
	<script th:src="@{/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>

	<!--layer-->
	<script th:src="@{/js/plugins/layer/layer.min.js}"></script>
	<script th:src="@{/js/jquery.form.js}"></script>

	<script th:inline="javascript">
			function init() {
                var newVar = [[${machineList}]];
                $('#exampleTableEvents').bootstrapTable({
                    data: newVar,
                    search: true,
                    pagination: true,
                    showRefresh: true,
                    height: 500,
                    showToggle: true,
                    showColumns: true,
                    iconSize: 'outline',
                    toolbar: '#exampleTableEventsToolbar',
                    icons: {
                        refresh: 'glyphicon-repeat',
                        toggle: 'glyphicon-list-alt',
                        columns: 'glyphicon-list'
                    }
                });
				
            }
			function add() {
				//iframe层
				//parent.layer.open
				layer.open({
					type: 2,
					title: '会议室设备添加',
					shadeClose: true,
					shade: false,
					area: ['500px', '80%'],
					content: '/toAddMachine' //iframe的url
				});
			}

			function change() {
                //iframe层
                //parent.layer.open
                var count = $("input[name='btSelectItem']:checked").length;
                if(count!=1){
                    layer.msg("请选择一条信息！");
                    return;
                }
                var boxid=$("input[name='btSelectItem']:checked").closest("tr").find("td:eq(1)").text();
                $.ajax({
                    type:"post",
                    data:{"mId":boxid},
                    url:"/toEditMachine",
                    success:function (data) {
                        layer.open({
                            type: 2,
                            title: '设备修改',
                            shadeClose: true,
                            shade: false,
                            area: ['500px', '80%'],
                            content: '/toEditMachine', //iframe的url
                        })
                    }
                })
			}
            function del() {
                var delArray=[];
                $('input[name="btSelectItem"]:checked').each(function(){
                    delArray.push($(this).closest("tr").find("td:eq(1)").text());
                });
                $.ajax({
                    type:"get",
                    data:{"delInfo":delArray},
                    url:"/delMachine",
                    traditional:true,
                    contentType:'json',
                    success:function (data) {
                        if(data=="成功"){
                            layer.msg("删除"+data);
                            setTimeout(function () {
                                location.reload();
                            },1000)
                        }else {
                            layer.msg("删除失败，至少选择一条信息！");
                        }
                    }
                });
            }
		</script>

</html>